import React, { Component } from 'react';

import axios from "axios";

export default class Search extends Component {
    search=()=>{
        const {value} =this.keywordElement;
        // console.log(value);
        this.props.updateState({isFirst:false,isLoading:true});
        axios.get("https://api.github.com/search/users?q="+value).then((res)=>{
            // console.log("成功了",res);
            // this.props.saveUsers(res.data.items);
            this.props.updateState({isLoading:false,users:res.data.items});
        }).catch((err)=>{
            // console.log("失败了",err);
            this.props.updateState({isLoading:false,err:"请求出错"});
        });
    };
    render() {
        return (
            <section className="jumbotron">
                <h3 className="jumbotron-heading">搜索github用户</h3>
                <div>
                    <input ref={(currentNode)=>{this.keywordElement=currentNode}} 
                        type="text" placeholder="输入关键词点击搜索" />&nbsp;
                    <button onClick={this.search}>搜索</button>
                </div>
            </section>
        );
    };
};
